<script type="text/javascript">
//<!--
$(function() {
	$("input.numeric").numeric();
	$("#submitFormAccordion").accordion({
		autoHeight: false
	});

	$("#submitFormNotAccordion").addClass("ui-accordion ui-widget ui-helper-reset")
		.find("h3")
		.addClass("ui-accordion-header ui-helper-reset ui-state-default ui-corner-top ui-corner-bottom")
		.prepend('<span class="ui-icon ui-icon-triangle-1-e"/>')
		.click(function() {
			$(this).toggleClass("ui-accordion-header-active").toggleClass("ui-state-active")
				.toggleClass("ui-state-default").toggleClass("ui-corner-bottom")
				.find("> .ui-icon").toggleClass("ui-icon-triangle-1-e").toggleClass("ui-icon-triangle-1-s")
				.end().next().toggleClass("ui-accordion-content-active").toggle();
				return false;
			})
		.next().addClass("ui-accordion-content ui-helper-reset ui-widget-content ui-corner-bottom").hide();
})

/**
 * Globals var
 */
var retry_get_json = 0;
var last_send_time = 0;

/**
 * return true = send form
 * return false = do not send
 */
function formCheck() {
	var send = false;
	// TODO try to check input file
	// see http://www.google.com/search?q=javascript+input+file
	if (confirm('Send the task through the Grid ?')) {
		send = true;
		retry_get_json = 0;
		setTimeout("getTaskID()", 500);
	}
	//alert("Still have to configure FTP and MEncoder");
	return send;
}

/**
 * get the Task ID from the json taskID in the iframe
 */
function getTaskID() {
	var err_getting_json = true;
	var result_json = $('#resultID').contents().find('#JSON').html();
	if (result_json) {
		var result = eval(result_json);
		if (result && result[0].time > last_send_time) {
			last_send_time = result[0].time;
			err_getting_json = false;
			if (result[0].taskID && result[0].taskID != "err") {
				updateTask(result[0].taskID);
			} else {
				showError(result[0].error);
			}
		}
	}

	if (err_getting_json) {
		if (retry_get_json<20) {
			retry_get_json++;
			setTimeout("getTaskID()", 500);
		} else {
			alert("timeout, no new response\nresult_json = "+result_json);
		}
	}
}

function showError(error) {
	alert("Servlet error:\n"+error);
}

function updateTask(taskID) {
	// update the global var
	last_task = taskID;
	// update the monitor list
	updatetasklist();
	// switch monitor tab , task list
	$("#tabs").tabs('select', 0);
	$("#monitor_tabs").tabs('select', 0);
}

var aa_see = false;
function changeAA() {
	if (aa_see) {
		$('#aa_threshold').hide("slow");
		$('#aa_depth').hide("slow");
		aa_see = false;
	} else {
		$('#aa_threshold').show("slow");
		$('#aa_depth').show("slow");
		aa_see = true;
	}
}
//-->
</script>

<!-- multipart/form-data
	http://www.w3.org/TR/html401/interact/forms.html#h-17.13.4.1 -->
<form method="post" target="result" onsubmit="return formCheck();" action="GC3DServlet" enctype="multipart/form-data">
	<div id="submitFormAccordion">
		<h3 class="smallHeader"><a href="">Input POV or ZIP File</a></h3>
		<div>
			<!-- new line -->
			<div class="submitLineContainer">
				Send a .pov file or a .zip archive contaning 1 .pov file and your .inc files (at the root)
			</div>
			<div class="submitLineContainer">
				<div><input id="inputFile" name="povfile" type="file"/> <input class="stdButton" value="Submit Task" type="submit"/></div>
			</div>
		</div>
	</div>
	<div id="submitFormNotAccordion">
		<h3 class="smallHeader"><a href="#">MegaPOV options</a></h3>
		<div>
			<!-- new line -->
			<div class="submitLineContainer">
				<div class="submitTextLeft"><label for="inputAa">&nbsp;</label></div>
				<div class="submitTextBigCenter"><input class="stdInputField numeric" onchange="changeAA();" id="inputAa" name="aa" type="checkbox"/><label for="inputAa">Anti-aliasing</label></div>
			</div>
			<!-- new line -->
			<div id="aa_threshold" class="submitLineContainer" style="display:none;">
				<div class="submitTextLeft"><label for="inputAat">&nbsp;</label></div>
				<div class="submitTextCenter"><input class="stdInputField numeric" id="inputAat" name="aat" type="text" value="0.1"/></div>
				<div class="submitTextRight"><label for="inputAat">Anti-aliasing Threshold</label></div>
			</div>
			<!-- new line -->
			<div id="aa_depth" class="submitLineContainer" style="display:none;">
				<div class="submitTextLeft"><label for="inputAad">&nbsp;</label></div>
				<div class="submitTextCenter"><input class="stdInputField numeric" id="inputAad" name="aad" type="text" value="2"/></div>
				<div class="submitTextRight"><label for="inputAad">Anti-aliasing Depth</label></div>
			</div>
			<!-- new line -->
			<div class="submitLineContainer">
				<div class="submitTextLeft"><label for="inputWidth">width</label></div>
				<div class="submitTextCenter"><input class="stdInputField numeric" id="inputWidth" name="width" type="text" value="640"/></div>
				<div class="submitTextRight"><label for="inputWidth">(better to be x16)</label></div>
			</div>
			<!-- new line -->
			<div class="submitLineContainer">
				<div class="submitTextLeft"><label for="inputHeight">height</label></div>
				<div class="submitTextCenter"><input class="stdInputField numeric" id="inputHeight" name="height" type="text" value="480"/></div>
				<div class="submitTextRight"><label for="inputHeight">(better to be x16)</label></div>
			</div>
			<!-- new line -->
			<div class="submitLineContainer">
				<div class="submitTextLeft"><label for="inputClockStart">start</label></div>
				<div class="submitTextCenter"><input class="stdInputField numeric" id="inputClockStart" name="clock_start" type="text" value="0"/></div>
				<div class="submitTextRight"><label for="inputClockStart">initial clock value</label></div>
			</div>
			<!-- new line -->
			<div class="submitLineContainer">
				<div class="submitTextLeft"><label for="inputClockEnd">end</label></div>
				<div class="submitTextCenter"><input class="stdInputField numeric" id="inputClockEnd" name="clock_end" type="text" value="1"/></div>
				<div class="submitTextRight"><label for="inputClockEnd">final clock value</label></div>
			</div>
			<!-- new line -->
			<div class="submitLineContainer">
				<div class="submitTextLeft"><label for="inputFrames">frames</label></div>
				<div class="submitTextCenter"><input class="stdInputField numeric" id="inputFrames" name="numberofframe" type="text" value="10"/></div>
				<div class="submitTextRight"><label for="inputFrames">number  of frames</label></div>
			</div>
		</div>
		<h3 class="smallHeader"><a href="#">MEncoder options</a></h3>
		<div>
			<!-- new line -->
			<div class="submitLineContainer">
				<div class="submitTextLeft"><label for="inputFPS">FPS</label></div>
				<div class="submitTextCenter"><input class="stdInputField numeric" id="inputFPS" name="fps" type="text" value="10"/></div>
				<div class="submitTextRight"><label for="inputFPS">Frames per second</label></div>
			</div>
			<!-- new line -->
			<div class="submitLineContainer">
				<div class="submitTextLeft"><label for="inputX264">bitrate</label></div>
				<div class="submitTextCenter"><input class="stdInputField numeric" id="inputX264" name="x264bitrate" type="text" value="800"/></div>
				<div class="submitTextRight"><label for="inputX264">x264 bitrate</label></div>
			</div>
			<!-- new line
			<div class="submitLineContainer">
				<div class="submitTextLeft"><label for="">&nbsp;</label></div>
				<div class="submitTextCenter">&nbsp;</div>
				<div class="submitTextRight"><label for="">&nbsp;</label></div>
			</div>-->
		</div>
	</div>
</form>
<!-- frame used for sending the form and receiving the taskid or errors -->
<iframe id="resultID" name="result" style="display:none;">no supported</iframe>